body {
    min-width: 320px;
    max-width: 750px;
    width: 10rem;
    margin: 0 auto;
    line-height: 1.5;
    font-family: Arial,Helvetica,STHeiTi,sans-serif;
    background: #f7f7f7;
    /* background-color: #302148; */
    color: #333;
}

/* css3 盒子模型 */
* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
/* 点击高亮我们需要清除清除设置为 transparent 完成透明 */
* {
    -webkit-tap-highlight-color: transparent;
}
/* 在移动端浏览器默认的外观在 ios 上加上这个属性才能给按钮和输入框自定义样式 */
input {
    -webkit-appearance: none;
}
/* 禁用长按页面时的弹出菜单 */
img, a { 
    -webkit-touch-callout: none; 
}
/* 去除聚焦 a, input 时的外边框 */
*, a:focus, input:focus {
    outline: 0;
}
/* 去除 a 链接下划线 */
a {
    text-decoration: none;
    color: #333;
}
/* 去除列表样式 */
li, ol, ul {
    list-style: none;
}
/* 清除内外边距 */
* {
    margin: 0;
    padding: 0;
}

/* 苏宁首页设计稿为 750px, 我们设定屏幕尺寸不超过 750px, 并且 flexible.js 将屏幕划分10等份 */
@media screen and (min-width: 750px) {
    html {
        font-size: 75px !important;
    }
}

img, input {
    vertical-align: middle;
}
img {
    display: block;
    width: 100%;
    height: 100%;
}

.nav-wrapper {
    width: 10rem;
    height: 2.4rem;
}
.index-nav {
    position: relative;
    background: #FFDB47;
    width: 10rem;
    margin: 0 auto;
    z-index: 100;
    font-size: .32rem;
    line-height: 1.173333rem;
    overflow: hidden;
}
.index-nav .nav-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 10rem;
    height: 2.4rem;
    overflow: hidden;
}
.index-nav .nav-bg img {
    position: absolute;
    bottom: 0;
    width: 10rem;
    height: 3.466667rem;
}
.index-nav .top-type {
    position: relative;
    width: 10rem;
}
.top-content {
    width: 9.093333rem;
    height: 1.173333rem;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
}
.top-head {
    display: flex;
    width: 7.6rem;
    height: 1.173333rem;
    justify-content: center;
    align-items: center;
}
.top-head img {
    width: 5.2rem; 
    height: 1.013333rem;
}
.search-bar {
   width: 10rem;
   height: 1.226667rem;
   padding: 0 .32rem; 
}
.search-bar a {
    display: block;
    position: absolute;
    width: 100%;
    height: 1.173333rem;
}
.search-icon {
    position: absolute;
    left: .266667rem;
    top: .373333rem;
    width: .48rem;
    height: .48rem;
    background: url(../images/search-icon.png) no-repeat;
    background-size: .48rem .48rem;
}
.search-input {
    border: none;
    width: 100%;
    height: .853333rem;
    line-height: .853333rem;
    border-radius: .4rem;
    color: #999;
    padding: .04rem .266667rem 0 .866667rem;
    font-size: .373333rem;
}
.index-nav .fixed-type {
    display: none;
}
.fixed-content {
    width: 9.093333rem;
    height: 1.173333rem;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
}
.index-nav-fixed {
    position: fixed;
    top: 0;
}
.index-nav-fixed .top-type {
    display: none;
}
.index-nav-fixed .fixed-type {
    display: flex;
    position: relative;
    width: 10rem;
}
.class {
    width: .48rem;
    height: .8rem;
}
.class img {
    width: .48rem;
    height: .8rem;
}
.login {
    width: .48rem;
    height: .8rem;
}
.login img {
    width: .48rem;
    height: .8rem;
}

.index-wrap {
    position: relative;
    width: 10rem;
}
.banner {
    position: relative;
    height: 3.053333rem;
    overflow: hidden;
}
.banner>img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3.053333rem;
}
.swipe-wrapper {
    position: absolute;
    width: 9.36rem;
    height: 3.053333rem;
    top: 0;
    left: .32rem;
}
.banner a {
    display: block;
    position: relative;
    width: 9.36rem;
    height: 3.053333rem;
}
.b-image {
    position: absolute;
    bottom: 0;
    left: -0.32rem;
    width: 10rem;
    height: 4.906667rem;
}
.b-logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 2.4rem;
    height: .666667rem;
}
.mint-swipe-items-wrap {
    border-radius: .32rem;
}
.mint-swipe-indicators {
    line-height: .106667rem;
    bottom: .16rem !important;
}
.swipe-wrapper .mint-swipe-indicator {
    width: .106667rem;
    height: .106667rem;
    line-height: .106667rem;
    margin: 0 .12rem;
    transition: width .2s;
}
.mint-swipe-indicator.is-active {
    width: .24rem;
    margin: 0 .053333rem;
    opacity: 1;
    border-radius: .106667rem;
}
/* hor-view */
.hor-view {
    width: 10rem;
    height: 2.656933rem;
    display: flex;
}
/* enter-list */
.enter-list {
    width: 10rem;
    height: 4.266667rem;
    overflow: hidden;
    background: url(../images/enter-bg.png);
    background-size: 10rem 4.266667rem;
}
.enter-list ul {
    width: 10rem;
    height: 3.733333rem;
}
.enter-list a {
    float: left;
    width: 2rem;
    height: 1.893333rem;
    text-align: center;
}
.enter-list a img {
    display: block;
    width: 1.12rem;
    height: 1.12rem;
    margin: .32rem .44rem 0;
}
.enter-list a span {
    display: block;
    width: 2rem;
    height: .373333rem;
    margin-top: .066667rem;
    line-height: .373333rem;
    font-size: .293333rem;
    color: #666;
}
/* 新人优惠 */
.new {
    width: 10rem;
    height: 3.12rem;
    margin-top: .32rem;
}
.new a {
    float: left;
    height: 3.12rem;
}
/* blank */
.blank {
    width: 10rem;
    height: .32rem;
}
/* 限时秒杀、大聚惠 */
.big-box1 {
    display: flex;
    margin: 0 auto;
    width: 9.36rem;
    height: 3.44rem;
    overflow: hidden;
    border-radius: .16rem .16rem 0 0;
}
.big-box1>div {
    position: relative;
    width: 4.666667rem;
    height: 3.44rem;
    background-color: #fff;
}
.seckill {
    box-sizing: content-box;
    border-right: 1px solid #f2f2f2;
}
.title-wrap {
    display: flex;
    align-items: flex-end;
}
.title {
    width: 1.493333rem;
    height: .533333rem;
    line-height: .533333rem;
    font-size: .373333rem;
    font-weight: 700;
    margin: .24rem .106667rem 0 .32rem;
}
.seckill .count  {
    height: .533333rem;
    font-size: .32rem;
}
.seckill .count span {
    display: inline-block;
    margin: 0 .033333rem;
    width: .453333rem;
    height: .373333rem;
    line-height: 1.4;
    text-align: center;
    background-color: #ffcc00;
    border-radius: .12rem;
    font-size: .266667rem;
    font-weight: bold;
}
.desc {
    font-size: .32rem;
    color: #999;
    overflow: hidden;
    margin: .053333rem 0 0 .32rem;
    width: 4rem;
    height: .4rem;
    line-height: .4rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.img-wrapper {
    position: absolute;
    width: 1.866667rem;
    height: 2.133333rem;
    top: 1.306667rem;
    left: .32rem;
}
.right-wrapper {
    left: 2.48rem;
}
.img-wrapper img {
    display: block;
    width: 1.6rem;
    height: 1.6rem;
    margin: 0 auto;
    background: none;
}
.img-desc {
    position: absolute;
    bottom: .106667rem;
    left: -0.066667rem;
    box-sizing: border-box;
    background-image: url(../images/img-desc.png);
    background-size: 2rem .72rem;
    width: 2rem;
    height: .72rem;
    padding-top: .293333rem;
    line-height: .426667rem;
    overflow: hidden;
    font-size: .266667rem;
    text-align: center;
}
/* 新品首发、苏宁拼购 */
.big-box2 {
    display: flex;
    margin: 0 auto;
    width: 9.36rem;
    height: 3.44rem;
    overflow: hidden;
    /* border-radius: .16rem .16rem 0 0; */
}
.big-box2>div {
    position: relative;
    width: 4.666667rem;
    height: 3.44rem;
    background-color: #fff;
}
.new-launch {
    box-sizing: content-box;
    border-right: 1px solid #f2f2f2;
}
.space {
    width: 9.36rem;
    height: 1px;
    margin: 0 auto;
    background: #f2f2f2;
}
/* 为您推荐 */
.for-you {
    display: flex;
    width: 9.36rem;
    height: 2.293333rem;
    margin: 0 auto;
    overflow: hidden;
    background-color: #fff;
    border-radius: 0 0 .16rem .16rem;
}
.for-you .left-title {
    width: 2.306667rem;
    height: 2.293333rem;
    padding: .626667rem .24rem 0;
}
.left-title p:nth-child(1) {
    width: 1.826667rem;
    height: .6rem;
    line-height: .6rem;
    font-size: .426667rem;
    font-weight: bold;
    color: #444;
}
.left-title p:nth-child(2) {
    width: 1.826667rem;
    height: .426667rem;
    line-height: .426667rem;
    font-size: .32rem;
    color: #999;
}
.right-items {
    display: flex;
    width: 6.773333rem;
    height: 2.293333rem;
    justify-content: space-between;
}
.right-items .item {
    width: 1.6rem;
    height: 2.293333rem;
}
.right-items .item img {
    width: 1.333333rem;
    height: 1.333333rem;
    margin: .24rem 0 0 .133333rem;
}
.right-items .item p {
    margin-top: .08rem;
    font-size: .293333rem;
    text-align: center;
    height: .4rem;
    line-height: .4rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/* 大促 */
.promotion {
    width: 10rem;
}
.promotion>div {
    padding: .133333rem 0 .2rem;
}
.hc-wrapper {
    width: 9.36rem;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}
.hc-item {
    position: relative;
    width: 2.226667rem;
    height: 3.24rem;
    margin-bottom: .173333rem;
}
.hc-item img:nth-child(2) {
    position: absolute;
    top: .106667rem;
    left: .173333rem;
    width: 1.866667rem;
    height: 1.866667rem;
}
.hc-item p:nth-of-type(1) {
    position: absolute;
    left: .24rem;
    top: 2.173333rem;
    width: 1.733333rem;
    height: .426667rem;
    font-size: .346667rem;
    color: #fff;
    line-height: .426667rem;
    text-align: center;
}
.hc-item p:nth-of-type(2) {
    position: absolute;
    left: .18rem;
    top: 2.653333rem;
    width: 1.866667rem;
    height: .426667rem;
    line-height: .426667rem;
    font-size: .266667rem;
    text-align: center;
    background-color: #fff;
    border-radius: .213333rem;
}
/* 推荐榜单 */
.new-bd {
    padding-bottom: .173333rem;
}
.title-img {
    width: 10rem;
    height: .8rem;
}
.bd-three {
    width: 9.36rem;
    margin: 0 auto .173333rem;
    display: flex;
    justify-content: space-between;
}
.bd-three-item {
    position: relative;
    width: 3.013333rem;
    height: 3.546667rem;
    border-radius: .16rem;
    background-color: #fff;
    overflow: hidden;
}
.item-bg {
    position: absolute;
    width: 3.013333rem;
    height: 1.24rem;
    left: 0;
    bottom: 0;
    border-radius: 0 0 .16rem .16rem;
}
.pro-img {
    position: relative;
    display: block;
    width: 2rem;
    height: 2rem;
    margin: .2rem auto 0;
}
.three-name {
    position: absolute;
    width: 100%;
    height: .453333rem;
    top: 2.106667rem;
    left: 0;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
}
.three-name span {
    box-sizing: border-box;
    display: block;
    height: .453333rem;
    font-size: .293333rem;
    line-height: .4rem;
    min-width: 1.333333rem;
    max-width: 2.666667rem;
    background: #FFF;
    color: #D9A87A;
    border: .026667rem solid #D9A87A;
    border-radius: .226667rem;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
}
.mySwiper .three-name span {
    color: #FB7F0A;
    border: .026667rem solid #FB7F0A;
}
.three-title {
    position: relative;
    width: 2.933333rem;
    height: .426667rem;
    font-size: .346667rem;
    line-height: .426667rem;
    margin: .413333rem auto .04rem;
    color: #FFFFFF;
    text-align: center;
    overflow: hidden;
}
.three-desc {
    position: relative;
    width: 2.666667rem;
    height: .32rem;
    line-height: .32rem;
    font-size: .293333rem;
    margin: 0 auto;
    color: #FFFFFF;
    opacity: .8;
    text-align: center;
    overflow: hidden;
}
.bd-two {
    display: -webkit-flex;
    display: flex;
    width: 9.36rem;
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: space-between;
    border-radius: .16rem;
    background: #FFF;
    overflow: hidden;
}
/* 猜你喜欢 */
.guessUlike {
    width: 10rem;
    margin-bottom: 1.346667rem;
}
.pro-list-wrapper {
    width: 10rem;
    background: #f7f7f7;
}
.pro-list {
    width: 9.36rem;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.left-list,
.right-list {
    width: 4.56rem;
}
.product {
    position: relative;
    width: 4.56rem;
    height: 7.226667rem;
    border-radius: .16rem;
    overflow: hidden;
    padding-bottom: .186667rem;
    margin-bottom: .24rem;
    background-color: #fff;
}
.product .proImg {
    width: 4.56rem;
    height: 4.56rem;
}
.pro-title {
    margin: .24rem auto 0;
    width: 4.24rem;
    height: .893333rem;
    line-height: 1.5;
    font-size: .346667rem;
    font-weight: bold;
    /* 标题超过两行省略 */
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    word-wrap: break-word;
    word-break: break-all;
}
.cuxiao-tag {
    display: flex;
    width: 3.586667rem;
    height: .32rem;
    margin: .146667rem .16rem .32rem;
    overflow: hidden;
    flex-wrap: wrap;
}
.cuxiao-tag img {
    display: block;
    margin-right: .08rem;
    height: .32rem;
    margin-bottom: .026667rem;
}
.tag1 {
    width: .64rem;
}
.tag2 {
    width: 1.706667rem;
}
.cuxiao-tag .cx-text {
    margin: 0 .04rem .026667rem .026667rem;
    border-radius: .08rem;
    height: .32rem;
    padding: .026667rem .16rem;
    line-height: .266667rem;
    font-size: .24rem;
    border: 1px solid #FFBB00;
    background: #FEFBEE;
}
.pro-price {
    height: .506667rem;
    line-height: .506667rem;
    margin-left: .16rem;
}
.real-price {
    display: -webkit-flex;
    display: flex;
    height: .506667rem;
    font-size: .32rem;
    color: #FF4422;
    font-weight: bold;
    align-items: flex-end;
}
.real-price .flag {
    line-height: .373333rem;
}
.pre-price {
    font-size: .48rem;
    line-height: .48rem;
}
.last-price {
    line-height: .373333rem;
}
.price-comments {
    color: #999999;
    margin-left: .173333rem;
    font-weight: normal;
    font-size: .266667rem;
}
/* bottom nav  */
.bottom-nav {
    box-sizing: content-box;
    display: flex;
    position: fixed;
    bottom: 0;
    width: 10rem;
    height: 1.333333rem;
    z-index: 199;
    margin: 0 auto;
    border-top: .013333rem solid #eee;
    background: #fff;
}
.bottom-nav a {
    display: block;
    width: 2rem;
    height: 1.333333rem;
}
.bottom-nav a img {
    width: .64rem;
    height: .64rem;
    margin: .16rem auto 0;
}
.bottom-nav a span {
    display: block;
    font-weight: normal;
   
    font-size: .266667rem;
    text-align: center;
    line-height: .426667rem;
    color: #666;
    
}
.bottom-nav a .index {
    font-weight: bold;
    color: #000;
}
/* 回到顶部 */
#top {
    position: fixed;
    width: 1.333333rem;
    height: 1.333333rem;
    background: url(../images/back-top.png) no-repeat;
    background-size: 1.333333rem 1.333333rem;
    bottom: 2.466667rem;
    right: .2rem;
}
/* to-login */
.to-login {
    position: fixed;
    width: 10rem;
    height: 1.2rem;
    bottom: 1.333333rem;
    z-index: 1;
}
/* 签到红包 */
.gift {
    position: fixed;
    bottom: 8.666667rem;
    right: .133333rem;
    width: 1.333333rem;
    height: 1.333333rem;
}

[v-cloak] {
    display: none;
}